<script setup lang="ts">
import {router} from "../main.ts";

const onClickLeft = () => {
router.push('/select')
}

</script>

<template>
  <van-nav-bar class="nav-bar"
               title="世界"
  >
  </van-nav-bar>

  <div id="building">
    <img src="../assets/最终返回键.png" class="back-btn1" alt="返回" @click="onClickLeft" />
    <div id="background-wrapper">

      <div id="background-container">
        <img ref="bgImage" alt="" id="background-img" src="../assets/最终学习路径展示.png">
      </div>


    </div>
  </div>
</template>

<style scoped>
.back-btn1 {
  position:fixed;
  float: left;
  top: -5px;
  width: 50px;
  height: 60px;
  z-index:2;
}


#building {
  width: 100%;
  height: 100%;
}

#background-wrapper {
  overflow-y: hidden;
  position: absolute;
  width: 100%;
  height: 100%;
}


#background-container {
  top: 46px;
  width: 100%;
  height: 100%;
  position: relative;
}

.nav-bar {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 46px;
  background-image: url("../assets/导航栏2.png");
  opacity:1;
  z-index:1;
}

